import type { FindAuthorQuery, FindAuthorQueryVariables } from 'types/graphql'

import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'

import Author from 'src/components/Author'

export const QUERY = gql`
  query FindAuthorQuery($id: Int!) {
    author: user(id: $id) {
      email
      fullName
    }
  }
`

export const Loading = () => <span>Loading...</span>

export const Empty = () => <span>Empty</span>

export const Failure = ({
  error,

  queryResult: {refetch: rerunQuery, client}
}: CellFailureProps<FindAuthorQueryVariables>) => (
  <span style={{ color: 'red' }}>Error: {error?.message} {rerunQuery} {client}</span>
)

export const Success = ({
  author,

  queryResult: {refetch, client: apolloClient}
}: CellSuccessProps<FindAuthorQuery, FindAuthorQueryVariables>) => (
  <span className="author-cell">
    <Author author={author} refetch={refetch} client={apolloClient}/>
  </span>
)
